<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./index.css">
</head>

<body>
    <!-- 头部 -->
    <div class="topBel">
        <!-- 导航栏部分 -->
        <div class="box water">
            <div class="left clearfix">
                <div class="logo">
                    <a href="#"><img src="./images/imlogo_b.png" alt=""></a>
                </div>
                <div class="title">
                    <ul>
                        <li style="background-color: rgb(18, 183, 245);"><a href="#">首页</a></li>
                        <li><a href="#">下载</a></li>
                        <li><a href="#">动态</a></li>
                    </ul>
                </div>
            </div>
            <div class="right clearfix">
                <a class="barzc" href="#" target="_blank">注册</a>
                <ul>
                    <li><a href="#" target="_blank">QQ安全</a></li>
                    <li><a href="#" target="_blank">QQ会员</a></li>
                    <li><a href="#" target="_blank">登录</a></li>
                </ul>
                <div class="flashData"><a href="#">当前在线人数:<em>227,763,015</em></a></div>
            </div>
        </div>
        <!-- 中间部分 -->
        <div class="centerLogo">
            <img src="./images/logo.png" alt="">
        </div>
        <div class="download"><a href="#">立即下载</a></div>
        <div class="icon">
            <img src="./images/icon.png" alt="">
        </div>
        <div class="topImg">
            <img src="./images/doc-j2.png" alt="">
        </div>
    </div>
    <!-- 中间部分 -->
    <div class="middleBer">
        <div class="top">
            <img src="./images/brand.png" alt="">
        </div>
        <div class="fisrtbg1"></div>
        <div class="text1">
            <img class="one" src="./images/pic1.png" alt="">
            <img class="text" src="./images/qcall_txt.png" alt="">
            <p class="title">无论何时何地,你都能自由享受QQ在各类终端<br>上带来的高清通话,与好友一起想聊多久聊多久</p>
            <p><a href="#">了解更多></a></p>
            <img src="./images/qcall_figs.png" alt="">
        </div>
        <div class="fisrtbg2"></div>
        <div class="text2"></div>
        <div class="fisrtbg3"></div>
        <div class="text3"></div>
    </div>
    <div class="bottom">
        <div>
            <img src="./images/plats1.png" alt="">
        </div>
    </div>
</body>

</html>